<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery-3.4.1.min.js"></script>
</head>
<body>

	<h1>登录界面</h1>
<!-- 	<form action="login.action" method="post"> -->
	姓名：<input type="text" name="cname"><p>
	密码：<input type="password" name="cpassword">
<!-- 	<input type="submit" value="登录">
	</form> -->
	<button type="button" >登录</button> 

	
	<script type="text/javascript">
		$(function(){
			$("button").click(function(){
					$.ajax({
						//发送的请求的类型
						type : 'post',
						//请求的url地址
						url : 'login.action',
						//前端传递到后端的数据
						data : {
							"cname" : $("input")[0].value,
							"cpassword" :  $("input")[1].value
						},
						//前端发送到后端的数据类型
						contentType : "application/x-www-form-urlencoded",
						//后端到前端的数据类型，json为传递的数据类型为json格式的字符串或者对象
						//如果后端没有返回数据到前端，则不能写dataType,除了json,还有html,xml,text
						dataType : 'json',
						
						//回调函数，请求成功时调用的函数，
						success : function(data){//后端发给前端的数据
							
							alert("登录成功");
							console.log("请求成功");
							console.log(data);
							
			
						},
						//回调函数，请求失败时调用的函数
						error : function(data){
							console.log("请求失败");
						}
				
				
				})
			})
		})
	
	
	</script>


</body>
</html>